<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>q</title>
    <style>
        ul li {
            position:relative;
            list-style: none;
            float: left;
            width:100px;
            height:200px;
            border: 1px solid blue;
            margin-left:-1px;
        }

        ul li:hover{
            z-index: 1; /* 也可以只在li中设置相对位置，这样就不用写z-index层级了 */
            border:1px solid red;
        }
    </style>
</head>
<body>
<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
</body>
</html>